import { Select } from 'antd'
import { useState, useEffect } from 'react'
import { getChannels } from '@/api'

const { Option } = Select

function Channles ({ value, onChange }) {
  const [channels, setChannels] = useState([])
  useEffect(() => {
    // 获取频道列表
    async function getData () {
      const res = await getChannels()
      setChannels(res.data.channels)
    }
    getData()
  }, [])

  return (
    <Select
      value={value}
      onChange={onChange}
      placeholder='请选择文章频道'
      style={{ width: 200 }}
    >
      {channels.map(i => {
        return (
          <Option value={i.id} key={i.id}>
            {i.name}
          </Option>
        )
      })}
    </Select>
  )
}

export default Channles
